<template>
	<view class="setting-container">
		<view class="setting-view u-m-b-20">
            <view class="u-flex u-m-t-20 u-m-b-20">
                <view class="u-flex u-flex-1" @click="handleJudgeLogin('/mine-module/profile')">
                    <u-image width="100" height="100" shape="circle" :src="user.face || defaultFace"></u-image>
                    <view class="u-m-l-20" v-if="user">
                        <view class="">
                            {{ user.nickname}}
                        </view>
                        <view class="uname">
                            用户名：{{ user.uname}}
                        </view>
                    </view>
                    <view class="u-m-l-20" v-else>登录/注册</view>
                </view>
                <view class="">
                    <u-icon name="arrow-right" color="#969799"></u-icon>
                </view>
            </view>
            <u-line color="#F6F7F9" />
            <view class="u-flex u-m-t-30 u-m-b-10" @click="handleJudgeLogin('/mine-module/address')">
                <view class="u-flex-1">
                    地址管理
                </view>
                <view class="">
                    <u-icon name="arrow-right" color="#969799"></u-icon>
                </view>
            </view>
        </view>
        <view class="setting-cont u-m-b-20">
            <u-cell-group :border="false">
                <u-cell-item title="账户安全" @click="handleJudgeLogin('/mine-module/account-safe')"></u-cell-item>
            </u-cell-group>
        </view>
        <view class="logout-view u-m-t-20" v-if="user" @click="onLogout">
            <view class="">
                退出登录
            </view>
        </view>
	</view>
</template>
<script>
    import * as API_Member from '@/api/members.js';
    import Cache,{Keys} from '@/utils/cache.js';

	export default {
		data() {
			return {
                user: '',
                defaultFace: '/static/images/member/icon-noface.jpg'
			};
		},
        onShow() {
            this.user = Cache.getItem('user')
        },
        methods: {
            //点击事件
            handleJudgeLogin(url, value) {
            	this.judgeLogin(() => {
                    uni.navigateTo({ url: url })
                }, 'force')
            },
            //退出登录
            onLogout() {
                uni.$emit('logout',{msg:'退出登录消息'})
                //清除会员信息
                uni.removeStorageSync(Keys.user);
                //清除token
                uni.removeStorageSync(Keys.accessToken);
                //后退并刷新数据
                uni.navigateBack({
                    delta: 1,
                    animationDuration: 300
                })
            }
        }
	}
</script>

<style lang="scss">
    .setting-view {
        background-color: #FFFFFF;
        padding: 26rpx 32rpx;
        border-bottom-left-radius: 20rpx;
        border-bottom-right-radius: 20rpx;
        .uname {
            font-size: 22rpx;
            color: #909399;
            margin-top: 10rpx;
        }
    }
    .setting-cont {
        background-color: #FFFFFF;
        border-radius: 20rpx;
        overflow: hidden;
        /deep/.u-cell_title {
            color: #333333;
        }
    }
    .logout-view {
        border-radius: 20rpx;
        background-color: #FFFFFF;
        padding: 20rpx;
        text-align: center;
    }
</style>
